﻿<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Logon.aspx.vb" Inherits="I_PORT.Logon" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<%@ Register Src="~/Control/Progress.ascx" TagName="Progress" TagPrefix="PG" %>
<%@ Register Assembly="MSCaptcha" Namespace="MSCaptcha" TagPrefix="cc1" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>iPORT - IRPC INTELLIGENT PORT SERVICE</title>
    <style type="text/css" >
body {
	margin: 0px;
	background-color: #30cadd;
}
#main {
	background-image: url(../image/bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}
#water {
	height: 190px;
	width: 950px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	position: relative;
}

#mainside {
	height: 353px;
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	background-image: url(../image/sky.jpg);
	background-repeat: no-repeat;
	position: relative;
}
#login {
	background-image: url(../image/login.png);
	background-repeat: no-repeat;
	height: 362px;
	width: 696px;
	position: absolute;
	left: 214px;
	top: -181px;
}
#ship2 {
	background-image: url(../image/ship2.png);
	background-repeat: no-repeat;
	height: 162px;
	width: 236px;
	position: absolute;
	left: 712px;
	top: -40px;
}
#iport-logo {
	background-image: url(../image/iport-logo.png);
	background-repeat: no-repeat;
	background-color:transparent;
	height: 92px;
	width: 250px;
	position: absolute;
	left: 507px;
	top: -228px;
	z-index: 100;
}
#form {
	height: 168px;
	width: 290px;
	position: absolute;
	left: 490px;
	top: -118px;
	z-index: 100;
}
#running {
	height: 43px;
	width: 868px;
	background-image: url(../image/running.png);
	background-repeat: no-repeat;
	position: absolute;
	left: 275px;
	top: 492px;
	z-index: 250;
}
#textbox {
	padding-top: 13px;
	padding-right: 15px;
	padding-bottom: 11px;
	padding-left: 15px;
	color: #ff3e3e;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	z-index: 250;
}
#Username {
	position: absolute;
	left: 214px;
	top: -181px;
	z-index:120;
}
#ship {
	background-image: url(../image/ship.png);
	background-repeat: no-repeat;
	height: 497px;
	width: 599px;
	position: absolute;
	left: -99px;
	top: 37px;
	z-index: 100;
	margin-bottom: 0px;
}
    </style>
    <script type="text/javascript" language="javascript">
       var TimeToFade = 2500.0;

function fade(eid)
{
  var element = document.getElementById(eid);
  if(element == null)
    return;
   

      element.FadeState = -2;
  if(element.FadeState == 1 || element.FadeState == -1)
  {
    element.FadeState = element.FadeState == 1 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
  }
  else
  {
    element.FadeState = element.FadeState == 2 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}
function animateFade(lastTick, eid)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
  
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? '1' : '0';
    element.style.filter = 'alpha(opacity = ' 
        + (element.FadeState == 1 ? '100' : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade;
  if(element.FadeState == 1)
    newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}
    </script>
    <script src="../jquery-1.5.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $(get_id("txtCap")).focus();
			var res = $.ajax({
					  type: "GET",
					  data: ({ 
						 mode:"read"
					  }),
					  url: "../ajax/logonTmp.aspx",
					  async: false,
					  cache: false
				  }).responseText
				  var json = eval('(' + res + ')');
				  $(get_id("txtUsername")).val(json.User);
				  $(get_id("txtPassword")).val(json.Pass);
			$(get_id("ImgLogon")).click(function(){
				var res = $.ajax({
					  type: "GET",
					  data: ({ 
						 userName:$(get_id("txtUsername")).val(),
						 pass:$(get_id("txtPassword")).val(),
						 mode:"write"
					  }),
					  url: "../ajax/logonTmp.aspx",
					  async: false,
					  cache: false
				  }).responseText
				
			});
           // $(get_id("txtPassword")).val("astery");
            $(get_id("txtCap")).attr("autocomplete", "off");
        });
    function get_id(elm) {
        var id = '[id$=' + elm + ']';
        return id;
    }
    </script>
</head>
<body>
<form id="form1" runat="server">
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
    <div id="ship"></div>
<div id="main">
 
  <div id="mainside"> 

  </div>
      <div id="running">
      <div id="textbox"><marquee onmouseover="stop();" onmouseout="start();" scrollamount="5"><asp:Literal id="LiLogon" runat="server"></asp:Literal></marquee></div>
    </div>
  <div id="water">
    <div id="iport-logo"></div>
    <div id="form"></div>
    <div id="login"></div>
      <div id="Username">
  <table width="100%" border="0" cellpadding="2" cellspacing="0">
      <tr>
         <td colspan="2" style="height:60px;"> <img src="../Image/space.gif" /></td>
      </tr>
      <tr>
        <td style="width:200px;">&nbsp;</td>
        <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
           <tr>
              <td style="width:155px;" align="right"><asp:Label ID="lbUsername" runat="server" SkinID="lbLogon" Text="Username :"></asp:Label>&nbsp;</td>
              <td align="left"><asp:TextBox ID="txtUsername" runat="server" Width="155" Height="18" BorderWidth="0" ></asp:TextBox></td>
           </tr>
        </table>
        </td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
           <tr>
              <td style="width:155px;" align="right"><asp:Label ID="lbPassword" runat="server" SkinID="lbLogon" Text="Password :"></asp:Label>&nbsp;</td>
              <td align="left"><asp:TextBox ID="txtPassword" runat="server"  Width="155" Height="18" BorderWidth="0"  TextMode="Password" ></asp:TextBox></td>
           </tr>
        </table>
       </td>
      </tr>
       <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
           <tr>
              <td style="width:155px;" align="right"><asp:Label ID="Label2" runat="server" SkinID="lbLogon" Text="Security Code :"></asp:Label>&nbsp;</td>
              <td align="left"><asp:TextBox ID="txtCap" runat="server"  Width="155" Height="18" BorderWidth="0" Text="" ></asp:TextBox> </td>
           </tr>
        </table>
       </td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
           <tr>
              <td style="width:155px;" align="right">&nbsp;</td>
              <td align="left">
              <table width="100%" border="0" cellpadding="0" cellspacing="0" >
                <tr>
                  <td style="width:158px;"><cc1:CaptchaControl ID="ccJoin" runat="server" CaptchaLength="5" CaptchaHeight="31" CaptchaWidth="155" CaptchaLineNoise="None" CaptchaMinTimeout="5" CaptchaMaxTimeout="240" /></td>
                  <td>&nbsp;</td>
                </tr>
              </table>
              </td>
           </tr>
        </table>
       </td>
      </tr>
      <tr>
         <td colspan="2" style="height:5px;"><img src="../Image/space.gif" /></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
           <tr>
              <td style="width:155px;" align="left">&nbsp;</td>
              <td align="left" valign="bottom"><asp:ImageButton ID="ImgLogon" runat="server" ImageUrl="~/Image/login-butt.png" /></td>
           </tr>
        </table>
        </td>
      </tr>
    </table>
  </div>
    <div id="ship2"></div>
  </div>

</div>
        <asp:UpdateProgress ID="UpdateProgress1" runat="server">
            <ProgressTemplate>
                <PG:Progress ID="Progress1" runat="server" />
            </ProgressTemplate>
         </asp:UpdateProgress>
      </ContentTemplate>
    </asp:UpdatePanel>
</form>
</body>

</html>